<template>
  <div class="container">
    <div class="container-title">
      <buildElH1 name="往届精彩回顾.png" type="1"></buildElH1>
      <buildElMore src="Review"></buildElMore>
    </div>
    <buildElThreeList @handDetails="handDetails" :tableData="tableData"></buildElThreeList>
  </div>
</template>
<script>
import buildElH1 from '../build-el-h1'
import buildElMore from '../build-el-more'
import buildElThreeList from '../build-el-three-list'
export default {
  components: {
    buildElH1,
    buildElMore,
    buildElThreeList,
  },
  data() {
    return {
      tableData: null,
      total: 0,
      pageSize: 3,
      pageNow: 1,
    }
  },
  async created() {
    await this.init(1)
  },
  methods: {
    handDetails(id) {
      this.toPage(id)
    },
    async init(page) {
      this.tableData = []
      let tableData = await this.api.selectNewsList8(page, this.pageSize)
      this.total = tableData.total
      this.tableData = tableData.list
      console.log('tableData', this.tableData)
    },
    changePage(e) {
      this.pageNow = e
      this.init(e)
    },
  },
}
</script>
<style lang="less" scoped>
.container {
  margin-bottom: 45px;
  .container-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}
</style>